<template>
	<u-popup v-model="loginShow" mode="center">
		<view class="shopingTips" :style="{
			'background-image':'url(' + $util.img('/static/img/shoping/公告.png') +')'
		}">
			<view class="box">
				<view class="content">
					<block v-if="content">{{content}}</block>
					<block v-else>更新公告...</block>
				</view>
				<u-button class="btn-primary" ripple-bg-color="rgba(0,0,0,.4)" @click="gotolink" :ripple="true">知道了</u-button>
			</view>
		</view>
	</u-popup>
</template>

<script>
	export default {
		props: {
			show: {
				type: [String, Boolean],
				default: false
			}
		},
		data() {
			return {
				loginShow:false,
				content:null
			}
		},
		watch:{
			show:{
				handler(newval,oldVal){
					this.loginShow = this.show;
				},
				immediate: true
			}
		},
		mounted() {
			this.getinfo();
		},
		methods:{
			gotolink(){
				this.$emit('callback');
				this.loginShow = false;
			},
			getinfo(){
				this.$http.asyncSendrequest({
					url:'/common/popNotice',
					success:res=>{
						this.content = res.data;
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.shopingTips {
		width: 80vw;
		height: 580rpx;
		border-radius:20rpx;
		overflow: hidden;
		position: relative;
		background-repeat: no-repeat;
		background-size: 100% 100%;
		.box{
			width: 100%;
			height: 100%;
			.content{
				margin: 176rpx 26rpx 60rpx;
				height: 200rpx;
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #000000;
				word-wrap: break-word;
			}
			.btn-primary {
				height: 96rpx;
				background: #292929;
				text-align: center;
				line-height: 96rpx;
				font-size: 26rpx;
				font-family: PingFang SC;
				color: #FFFFFF;
				margin: 0 55rpx;
				margin-bottom: 23rpx;
			}
		}
		
	}
</style>